<template>
	<view class="first-install-layout">
		<view class="top-box" :style="{marginTop:systemStore.sysInfo.statusBarHeight + 20 + 'px'}">
			<image class="top-logo" src="/static/login/login_top_img@2x.png" mode="widthFix"></image>
			<view class="top-name-box">
				<text>汇拓宝v1.0.0</text>
				<text>汇收米（上海）数据服务有限公司</text>
			</view>
		</view>
		<view class="first-install-header">用户协议与隐私政策</view>
		<view class="first-install-container">
			<text>我们将悉心帮你管理解决POS展业中的大小事务，达成更多目标。</text>
			<view class="first-install-container-1">
				<text>感谢您使用汇拓宝。为保护您的个人信息安全，我们将依据汇拓宝的<text style="color: #5F56EF;" @tap="showAgreementInfo(1)">《用户协议》</text>和<text style="color: #5F56EF;" @tap="showAgreementInfo(2)">《隐私政策》</text>来帮助您了解：我们如何收集个人信息、如何使用及储存个人信息，以及您享有的相关权利。其中重点条款已为您标注，方便你了解自己的相关权利：</text>
			</view>
			<view class="first-install-container-2">
				<text>1. 存储权限：用于缓存图片和文本信息；</text>
				<text>2. 相机权限：用于OCR识别图片信息；</text>
				<text>3. 相册权限：用于上传头像及图片，保存图片；</text>
				<text>4. 设备状态：用于接收应用推送信息；</text>
				<text>5. 定位权限：用于辅助用户填写当前位置信息；</text>
			</view>
			<view class="first-install-container-1">
				<text>您可以通过阅读完整版<text style="color: #5F56EF;" @tap="showAgreementInfo(1)">《用户协议》</text>和<text style="color: #5F56EF;" @tap="showAgreementInfo(2)">《隐私政策》</text>了解详细信息。如您同意，请点击“同意并继续”开始使用我们的服务。</text>
			</view>
		</view>
		<view class="submit-btn" style="margin: 0;" @tap="agree">同意</view>
		<view class="no-btn" @tap="noAgree">暂不同意</view>
		<xh-tip-pop ref="tipRef"></xh-tip-pop>
	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import { useSystem , useConfigStore} from '@/common/stores'
	import XhTipPop from './widget/xh-tip-pop.vue'
	import { app_user_agreement,app_user_privacy } from '@/common/config/config.js'
	const systemStore = useSystem()
	const configStore = useConfigStore()
	const tipRef = ref(null)
	// 不同意
	const noAgree = () => {
		tipRef.value.open()
	}
	// 同意
	const agree = () => {
		configStore.setFirstInstallConfig(true)
		uni.reLaunch({
			url:'/pages/login/login'
		})
	}
	//查看协议信息
	const showAgreementInfo = (type) => {
		if (type == 1) {
			uni.navigateTo({
				url: `/pages/webview/webview?title=用户协议&url=${app_user_agreement()}`
			})
		} else if (type == 2) {
			uni.navigateTo({
				url: `/pages/webview/webview?title=隐私政策&url=${app_user_privacy()}`
			})
		}
	}
</script>

<style lang="scss" scoped>
	.first-install-layout {
		background-color: #fff;
		min-height: 100vh;
		padding: 30rpx 30rpx 100rpx;

		.top-box {
			display: flex;
			align-items: center;
			justify-content: center;

			.top-logo {
				width: 180rpx;
			}

			.top-name-box {
				display: flex;
				flex-direction: column;
				margin-left: 20rpx;
				font-size: 30rpx;

				text:nth-child(1) {
					font-size: 32rpx;
					color: $xh-theme-color;
					margin-bottom: 16rpx;
				}
			}
		}

		.first-install-header {
			font-size: 36rpx;
			font-weight: 500;
			text-align: center;
			margin-top: 30rpx;
		}

		.first-install-container {
			padding: 60rpx 0;
			color: $xh-color-6;
			.first-install-container-1 {
				color: $xh-color-6;
			}
			.first-install-container-2 {
				color: $xh-color-6;
				display: flex;
				flex-direction: column;
				margin-left: 30rpx;
			}

			.first-install-container-3 {
				color: $xh-color-6;
			}

			text {
				line-height: 54rpx;
			}
		}

		.no-btn {
			text-align: center;
			padding: 40rpx;
			color: $xh-color-9;
			font-size: 30rpx;
		}
	}
</style>